<!DOCTYPE html>

<html lang="en">


<head th:replace="fragments/headTag :: headTag">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title>PetClinic :: a Spring Framework demonstration</title>

    <link href="https://cdn.bootcss.com/twitter-bootstrap/2.3.0/css/bootstrap.min.css"
        th:href="@{/webjars/bootstrap/2.3.0/css/bootstrap.min.css}" rel="stylesheet"/>
    <link href="../../static/resources/css/petclinic.css"
        th:href="@{/resources/css/petclinic.css}" rel="stylesheet"/>
    
    <script  src="https://cdn.bootcss.com/jquery/1.9.0/jquery.min.js"
        th:src="@{/webjars/jquery/1.9.0/jquery.js}"></script>
    <script src="https://cdn.bootcss.com/jqueryui/1.9.2/jquery-ui.min.js"
        th:src="@{/webjars/jquery-ui/1.9.2/js/jquery-ui-1.9.2.custom.js}"></script>
    
    <link href="https://cdn.bootcss.com/jqueryui/1.11.0/jquery-ui.css"
        th:href="@{/webjars/jquery-ui/1.9.2/css/smoothness/jquery-ui-1.9.2.custom.css}" rel="stylesheet"></link>

</head>

<body>
<div class="container">
    <div th:include="fragments/bodyHeader" th:remove="tag">
    
        <img th:src="@{/resources/images/banner-graphic.png}" 
            src="../../static/resources/images/banner-graphic.png"/>
        
        <div class="navbar" style="width: 601px;">
            <div class="navbar-inner">
                <ul class="nav">
                    <li style="width: 100px;"><a href="../welcome.html" th:href="@{/}"><i class="icon-home"></i>Home</a></li>
                    <li style="width: 130px;"><a href="s.html" th:href="@{/owners/find.html}"><i class="icon-search"></i>Find owners</a></li>
                    <li style="width: 140px;"><a href="../vets/vetList.html" th:href="@{/vets.html}"><i class="icon-th-list"></i>Veterinarians</a></li>
                    <li style="width: 90px;"><a href="../exception.html" th:href="@{/oups.html}" title="trigger a RuntimeException to see how it is handled"><i class="icon-warning-sign"></i>Error</a></li>
                    <li style="width: 80px;"><a href="#" title="not available yet. Work in progress!!"><i class=" icon-question-sign"></i>Help</a></li>
                </ul>
            </div>
        </div>
            
            
    </div>


    <h2>
        <span th::if="${owner['new']}" th:remove="tag">New </span> Owner
    </h2>
    <form th:object="${owner}" th:method="${owner['new']} ? 'post' : 'put'" action="ownerDetails.html"
        th:action="@{${#httpServletRequest.servletPath}}" class="form-horizontal" id="add-owner-form">
        <div class="control-group" th:classappend="${#fields.hasErrors('firstName')} ? 'error' : ''">
            <label class="control-label">First Name</label>
            <div class="controls">
                <input type="text" th:field="*{firstName}" />
                <span class="help-inline" th:errors="*{firstName}">[error]</span>
            </div>
        </div>
    
        <div class="control-group" th:classappend="${#fields.hasErrors('lastName')} ? 'error' : ''">
            <label class="control-label">Last Name</label>
            <div class="controls">
                <input type="text" th:field="*{lastName}" />
                <span class="help-inline" th:errors="*{lastName}">[error]</span>
            </div>
        </div>
    
        <div class="control-group" th:classappend="${#fields.hasErrors('address')} ? 'error' : ''">
            <label class="control-label">Address</label>
            <div class="controls">
                <input type="text" th:field="*{address}" />
                <span class="help-inline" th:errors="*{address}">[error]</span>
            </div>
        </div>
    
        <div class="control-group" th:classappend="${#fields.hasErrors('city')} ? 'error' : ''">
            <label class="control-label">City</label>
            <div class="controls">
                <input type="text" th:field="*{city}" />
                <span class="help-inline" th:errors="*{city}">[error]</span>
            </div>
        </div>
    
        <div class="control-group" th:classappend="${#fields.hasErrors('telephone')} ? 'error' : ''">
            <label class="control-label">Telephone</label>
            <div class="controls">
                <input type="text" th:field="*{telephone}" />                
                <span class="help-inline" th:errors="*{telephone}">[error]</span>
            </div>
        </div>

        <div class="form-actions">
            <button th:if="${owner['new']}" type="submit">Add Owner</button>
            <button th:unless="${owner['new']}" type="submit">Update Owner</button>
        </div>
    </form>
</div>

<table th:replace="fragments/footer :: footer" class="footer">
    <tr>
        <td></td>
        <td align="right">
           <img src="../../static/resources/images/springsource-logo.png"
            th:src="@{/resources/images/springsource-logo.png}" alt="Sponsored by SpringSource" />
        </td>
    </tr>
</table>

</body>

</html>
